import 'package:flutter/material.dart';
import 'res/listData.dart';
import 'dart:math';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // ThemeData 是flutter用于定义应用主题样式的类
      // 你可以通过它设置颜色、字体、按钮样式等全局风格。
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.red), // 主色
        brightness: Brightness.light, // 亮色主题
        fontFamily: 'Roboto', // 字体
        useMaterial3: true, // 建议开启Material3
        appBarTheme: const AppBarTheme(
          backgroundColor: Colors.red, // 背景色
          foregroundColor: Colors.black, // 字体颜色
        ),
      ),
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Flutter app'),
          //backgroundColor: Theme.of(context).colorScheme.primary, // 强制使用主题颜色
        ),
        body: MyHomePage(),
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  List<Widget> _initListViewData() {
    var tmpList = listData.map((value) {
      return Card(
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
        elevation: 20,
        margin: const EdgeInsets.all(10),
        child: Column(
          children: [
            AspectRatio(
              aspectRatio: 16 / 9,
              child: Image.network(value['imageUrl'], fit: BoxFit.cover),
            ),
            ListTile(
              // ClipOval 将子组件裁剪成椭圆或圆形的控件，常用于头像、圆形按钮等场景
              // 若宽高，设置不一样，会变成椭圆
              leading: ClipOval(
                /**
                 * Clip.none：不裁剪，超出部分会显示出来。
                 *Clip.hardEdge：裁剪到边界，超出部分直接被裁掉（常用）。
                 *Clip.antiAlias：裁剪并抗锯齿，边缘更平滑。
                 *Clip.antiAliasWithSaveLayer：抗锯齿并保存图层，效果更好但性能较低。
                 */
                clipBehavior: Clip.antiAlias,
                child: Image.network(
                  value['imageUrl'],
                  fit: BoxFit.cover,
                  width: 60,
                  height: 40,
                ),
              ),
              title: Text(value['title']),
              subtitle: Text(value['author']),
            ),
          ],
        ),
      );
    });
    return tmpList.toList();
  }

  @override
  Widget build(BuildContext context) {
    return ListView(children: _initListViewData());
  }
}
